<%@ include file="/common/taglibs.jsp"%>

<script type="text/javascript">
$(function() {
    $("#saveOrUpdateAcademic_exam_date").datepicker({
	    	changeMonth: true,
        changeYear: true,
	});
   
});

var count=0;

function myClickHandler() {
   	$("#error_div1").hide();
}


function deleteRow(row)
 {
	 if(count<=0){
		 $("#error_div1").html("No Privilege to Remove");
		 $("#error_div1").show();
		return false;
	 }
	 else{
  var delRow=row.parentNode.parentNode.parentNode.rowIndex;
  document.getElementById('layoutTable').deleteRow(delRow);
  count--;
	 }
	 
 }

function cloneMappingRow(id){
	var table   = document.getElementById( id );
    if ( table ) {
      var tbody   = table.getElementsByTagName('tbody')[ 0 ];
      var numRows = tbody.rows.length;
      var lastRow = tbody.rows[ numRows - 1 ];
      var newRow  = lastRow.cloneNode( true );
      newRow.setAttribute( 'id', 'row' + numRows );
      tbody.appendChild( newRow );
	}
    count++;
}
</script>
<style>
	#ui-datepicker-div {
	    font-family: "Trebuchet MS","Helvetica","Arial","Verdana","sans-serif";
	    font-size: 62.5%;
	}
</style>

<script>
jQuery(document).ready(function(){
	jQuery("#exam").validate();
});
</script>

<div class="error_div" id="error_div1"></div>

<div style="padding:5px;" align="center">
	<!-- <span class="head-dec">Enter Exam Details</span> --><br/><br/>
	<s:form id="exam" name="exam" action="saveOrUpdateExam" method="post">
	 <table border="0">
	 	<tr>
	 		<td class="inputField" nowrap="nowrap">
     			Class Name
     		</td>
			<td class="inputTextBox">
				<s:select  name="classYear" id="saveOrUpdateExam_class_name" emptyOption="true" list="classYears" listKey="id" displayName="Class" listValue="name" value="%{exam.getClassYear().getId()}" cssStyle="width:200px" />
			</td>
		</tr>	
     	<tr>
     		<td class="inputField" nowrap="nowrap">
     			Examination Name
     		</td>
			<td class="inputTextBox">
				<s:textfield name="exam.examName"  id="saveOrUpdateExam_exam_name" required="true" style="width:250px;"  cssClass="required"/>
			</td>
		</tr>
		<tr>
				<td class="inputField" nowrap="nowrap">
     			Status
     		</td>
			<td class="inputTextBox">
				<s:radio  name="exam.status" id="saveOrUpdateExam_exam_status" list="#{'Active':'Active','InActive':'InActive'}" value="%{exam.getStatus()}" />
			</td>
		</tr>		
		<tr>
			<table id="layoutTable" border="0" cellspacing="0" cellpadding="0" 	width="250px">
				<thead class="th_content">
					<tr class="gridTable">
						<th width="18px">Subject</th>
						<th width="15px">Max Mark</th>
					</tr>
				</thead>
				<tbody>
				<s:if test="exam.examPapers.size() > 0">
				   <s:iterator value="exam.examPapers" var="queryColumn" status="rowstatus">
						<tr id="clonablerow">
				   		 <td><s:select  name="subjectIds" id="subjectIds" emptyOption="true" list="subjectList" listKey="id" displayName="Subject" value="%{subjectId}" listValue="subjectName" Style="width:100px"/></td>
				   		 <td><s:textfield name="maxMarks"  id="maxMarks" cssClass="text medium" required="true" value="%{maxMark}" /></td>
				   		 <td><s:textfield size="10" name="dates" id="saveOrUpdateAcademic_exam_date" value="%{date}" style="width:150px;"/></td>
				   		 <td width="17px"><p>&nbsp;<a href="javascript:;" onclick="cloneMappingRow('layoutTable')">Add</a></p></td>
						 <td width="17px"><p>&nbsp;<a href="javascript:;" onclick="deleteRow(this)">Remove</a></p></td>
						</tr>
					</s:iterator>
				</s:if>
				<s:else>
				    <tr id="clonablerow">		
				   		 <td><s:select  name="subjectIds" id="subjectIds" emptyOption="true" list="subjectList" listKey="id" displayName="Subject" listValue="subjectName" Style="width:100px" /></td>
				   		 <td><s:textfield name="maxMarks"  id="maxMarks" cssClass="text medium" required="true" /></td>
				   		 <td> <s:textfield size="10" name="dates" id="saveOrUpdateAcademic_exam_date" style="width:150px;"/></td>
				   		 <td width="17px"><p>&nbsp;<a href="javascript:;" onclick="cloneMappingRow('layoutTable')">Add</a></p></td>
						 <td width="17px"><p>&nbsp;<a href="javascript:;" onclick="deleteRow(this)">Remove</a></p></td>
				   	</tr>
				 </s:else>
			   	</tbody>
		   </table>
		</tr>		
		<tr>
		<td colspan="2">
				<s:reset value="Clear" id="saveOrUpdateExam_0" cssClass="button-gray" theme="simple"/>
				<s:if test="exam.id == null || exam.id == ''">
					<s:submit value="Create" id="saveOrUpdateExam_0" cssClass="button-green" theme="simple" />
				</s:if>
				<s:else>
					<s:submit value="Update" id="saveOrUpdateExam_0" cssClass="button-green" theme="simple" />
				</s:else>
				<input type="button" value="List" id="saveOrUpdateExam_0" class="button-gray" onclick="javascript:showLists('/showExamList');" />
			</td>
		</tr>	
	</table>
	<s:hidden id="id" name="exam.id"></s:hidden>	
	</s:form>
</div> 
